Ext.define("Ext.ux.LayuiIconPicker",{
	extend:'Ext.window.Window',
	xtype:'layui_icon_picker',
	floating:true,
	closeToolText:"关闭",
	title:"layui图标选择器",
	frame:true,
	closable:true,
	width:580,
	height:450,
	tpl :[
		'<style>.site-doc-icon li {display: inline-block;vertical-align: middle; cursor:pointer; width: 180px;',
		'height: 105px;',
    'line-height: 25px; padding: 20px 0; margin-right: -1px;',
   ' margin-bottom: -1px; border: 1px solid #e2e2e2; font-size: 14px;',
   ' text-align: center; color: #666; transition: all .3s; -webkit-transition: all .3s;}</style>',
		'<div style="background:#fff;padding:10px;">',
		' <div class="site-title" style="margin:20px 0px 20px 20px;background:#fff;">',
		'<label class="layui-form-label">搜索</label>',
		
		'<div class="layui-input-inline" >',
		'<input type="text" id="search" autocomplete="off" class="layui-input" style="z-index:9999;">',
		'<div style="text-align:right;">使用说明:引入/layui/2.3.0/css/layui.css文件</div>',
		'</div></div>',
		'<ul class="site-doc-icon" id="layui_icon_list" style="overflow-y: scroll;height:300px;">',
		'<tpl for="list">',
		'<li style="cursor:pointer;">',
        '<i class="layui-icon {name}"></i>',
        '<div class="doc-icon-name">{text}</div>',
        '<div class="doc-icon-fontclass">{name}</div>',
        '</li>',
		'</tpl>',
		'</ul></div>'
	],
	data:{
		list:[{"sid":1,"name":"layui-icon-404","code":"&#xe61c;","text":"404","rank":10001},
			{"sid":2,"name":"layui-icon-about","code":"&#xe60b;","text":"关于","rank":10001},
			{"sid":3,"name":"layui-icon-add-1","code":"&#xe654;","text":"添加","rank":10001},
			{"sid":4,"name":"layui-icon-add-circle","code":"&#xe61f;","text":"添加-圆圈","rank":10001},
			{"sid":5,"name":"layui-icon-add-circle-fine","code":"&#xe608;","text":"添加-圆圈-细体","rank":10001},
			{"sid":6,"name":"layui-icon-align-center","code":"&#xe647;","text":"居中对齐","rank":10001},
			{"sid":7,"name":"layui-icon-align-left","code":"&#xe649;","text":"左对齐","rank":10001},
			{"sid":8,"name":"layui-icon-align-right","code":"&#xe648;","text":"右对齐","rank":10001},
			{"sid":9,"name":"layui-icon-app","code":"&#xe653;","text":"应用","rank":10001},
			{"sid":10,"name":"layui-icon-auz","code":"&#xe672;","text":"授权","rank":10001},
			{"sid":11,"name":"layui-icon-camera","code":"&#xe660;","text":"相机-空心","rank":10001},
			{"sid":12,"name":"layui-icon-camera-fill","code":"&#xe65d;","text":"相机-实心","rank":10001},
			{"sid":13,"name":"layui-icon-carousel","code":"&#xe634;","text":"轮播组图","rank":10001},
			{"sid":14,"name":"layui-icon-cart","code":"&#xe657;","text":"购物车","rank":10001},
			{"sid":15,"name":"layui-icon-cart-simple","code":"&#xe698;","text":"购物车","rank":10001},
			{"sid":16,"name":"layui-icon-cellphone","code":"&#xe678;","text":"手机","rank":10001},
			{"sid":17,"name":"layui-icon-cellphone-fine","code":"&#xe63b;","text":"手机-细体","rank":10001},
			{"sid":18,"name":"layui-icon-chart","code":"&#xe62c;","text":"图表","rank":10001},
			{"sid":19,"name":"layui-icon-chart-screen","code":"&#xe629;","text":"图标 报表 屏幕","rank":10001},
			{"sid":20,"name":"layui-icon-chat","code":"&#xe606;","text":"客服","rank":10001},
			{"sid":21,"name":"layui-icon-circle","code":"&#xe63f;","text":"单选框-候选","rank":10001},
			{"sid":22,"name":"layui-icon-circle-dot","code":"&#xe617;","text":"圆点","rank":10001},
			{"sid":23,"name":"layui-icon-close","code":"&#x1006;","text":"关闭-空心","rank":10001},
			{"sid":24,"name":"layui-icon-close-fill","code":"&#x1007;","text":"关闭-实心","rank":10001},
			{"sid":25,"name":"layui-icon-code-circle","code":"&#xe635;","text":"代码-圆圈","rank":10001},
			{"sid":26,"name":"layui-icon-component","code":"&#xe857;","text":"组件","rank":10001},
			{"sid":27,"name":"layui-icon-console","code":"&#xe665;","text":"控制台","rank":10001},
			{"sid":28,"name":"layui-icon-date","code":"&#xe637;","text":"日期","rank":10001},
			{"sid":29,"name":"layui-icon-delete","code":"&#xe640;","text":"删除","rank":10001},
			{"sid":30,"name":"layui-icon-dialogue","code":"&#xe63a;","text":"聊天 对话 沟通","rank":10001},
			{"sid":31,"name":"layui-icon-diamond","code":"&#xe735;","text":"钻石-等级","rank":10001},
			{"sid":32,"name":"layui-icon-dollar","code":"&#xe659;","text":"金额-美元","rank":10001},
			{"sid":33,"name":"layui-icon-down","code":"&#xe61a;","text":"箭头 向下","rank":10001},
			{"sid":34,"name":"layui-icon-download-circle","code":"&#xe601;","text":"下载-圆圈","rank":10001},
			{"sid":35,"name":"layui-icon-edit","code":"&#xe642;","text":"编辑","rank":10001},
			{"sid":36,"name":"layui-icon-engine","code":"&#xe628;","text":"引擎","rank":10001},
			{"sid":37,"name":"layui-icon-face-cry","code":"&#xe69c;","text":"表情-哭泣","rank":10001},
			{"sid":38,"name":"layui-icon-face-smile","code":"&#xe6af;","text":"表情-微笑","rank":10001},
			{"sid":39,"name":"layui-icon-face-smile-b","code":"&#xe650;","text":"表情-笑-粗","rank":10001},
			{"sid":40,"name":"layui-icon-face-smile-fine","code":"&#xe60c;","text":"表情-笑-细体","rank":10001},
			{"sid":41,"name":"layui-icon-face-surprised","code":"&#xe664;","text":"表情-惊讶","rank":10001},
			{"sid":42,"name":"layui-icon-female","code":"&#xe661;","text":"女","rank":10001},
			{"sid":43,"name":"layui-icon-file","code":"&#xe621;","text":"文件","rank":10001},
			{"sid":44,"name":"layui-icon-file-b","code":"&#xe655;","text":"文件-粗","rank":10001},
			{"sid":45,"name":"layui-icon-find-fill","code":"&#xe670;","text":"发现-实心","rank":10001},
			{"sid":46,"name":"layui-icon-fire","code":"&#xe756;","text":"火","rank":10001},
			{"sid":47,"name":"layui-icon-flag","code":"&#xe66c;","text":"旗帜","rank":10001},
			{"sid":48,"name":"layui-icon-fonts-clear","code":"&#xe639;","text":"文字格式化","rank":10001},
			{"sid":49,"name":"layui-icon-fonts-code","code":"&#xe64e;","text":"代码","rank":10001},
			{"sid":50,"name":"layui-icon-fonts-del","code":"&#xe64f;","text":"删除线","rank":10001},
			{"sid":51,"name":"layui-icon-fonts-html","code":"&#xe64b;","text":"HTML","rank":10001},
			{"sid":52,"name":"layui-icon-fonts-i","code":"&#xe644;","text":"字体-斜体","rank":10001},
			{"sid":53,"name":"layui-icon-fonts-strong","code":"&#xe62b;","text":"字体加粗","rank":10001},
			{"sid":54,"name":"layui-icon-fonts-u","code":"&#xe646;","text":"字体-下划线","rank":10001},
			{"sid":55,"name":"layui-icon-form","code":"&#xe63c;","text":"表单","rank":10001},
			{"sid":56,"name":"layui-icon-friends","code":"&#xe612;","text":"好友","rank":10001},
			{"sid":57,"name":"layui-icon-group","code":"&#xe613;","text":"群组","rank":10001},
			{"sid":58,"name":"layui-icon-headset","code":"&#xe6fc;","text":"音频-耳机","rank":10001},
			{"sid":59,"name":"layui-icon-help","code":"&#xe607;","text":"帮助","rank":10001},
			{"sid":60,"name":"layui-icon-home","code":"&#xe68e;","text":"主页","rank":10001},
			{"sid":61,"name":"layui-icon-layer","code":"&#xe638;","text":"窗口","rank":10001},
			{"sid":62,"name":"layui-icon-layouts","code":"&#xe632;","text":"布局","rank":10001},
			{"sid":63,"name":"layui-icon-left","code":"&#xe603;","text":"箭头 向左","rank":10001},
			{"sid":64,"name":"layui-icon-link","code":"&#xe64c;","text":"链接","rank":10001},
			{"sid":65,"name":"layui-icon-list","code":"&#xe60a;","text":"列表","rank":10001},
			{"sid":66,"name":"layui-icon-loading","code":"&#xe63d;","text":"loading","rank":10001},
			{"sid":67,"name":"layui-icon-loading-1","code":"&#xe63e;","text":"loading","rank":10001},
			{"sid":68,"name":"layui-icon-location","code":"&#xe715;","text":"位置-地图","rank":10001},
			{"sid":69,"name":"layui-icon-log","code":"&#xe60e;","text":"记录","rank":10001},
			{"sid":70,"name":"layui-icon-login-qq","code":"&#xe676;","text":"QQ","rank":10001},
			{"sid":71,"name":"layui-icon-login-wechat","code":"&#xe677;","text":"微信","rank":10001},
			{"sid":72,"name":"layui-icon-login-weibo","code":"&#xe675;","text":"微博","rank":10001},
			{"sid":73,"name":"layui-icon-male","code":"&#xe662;","text":"男","rank":10001},
			{"sid":74,"name":"layui-icon-menu-fill","code":"&#xe60f;","text":"菜单 隐身 实心","rank":10001},
			{"sid":75,"name":"layui-icon-more","code":"&#xe65f;","text":"菜单-水平","rank":10001},
			{"sid":76,"name":"layui-icon-more-vertical","code":"&#xe671;","text":"菜单-垂直","rank":10001},
			{"sid":77,"name":"layui-icon-next","code":"&#xe65b;","text":"下一页","rank":10001},
			{"sid":78,"name":"layui-icon-note","code":"&#xe66e;","text":"便签","rank":10001},
			{"sid":79,"name":"layui-icon-notice","code":"&#xe667;","text":"消息-通知","rank":10001},
			{"sid":80,"name":"layui-icon-ok","code":"&#xe605;","text":"对 OK","rank":10001},
			{"sid":81,"name":"layui-icon-ok-circle","code":"&#x1005;","text":"正确","rank":10001},
			{"sid":82,"name":"layui-icon-password","code":"&#xe673;","text":"密码","rank":10001},
			{"sid":83,"name":"layui-icon-pause","code":"&#xe651;","text":"暂停","rank":10001},
			{"sid":84,"name":"layui-icon-picture","code":"&#xe64a;","text":"图片","rank":10001},
			{"sid":85,"name":"layui-icon-picture-fine","code":"&#xe60d;","text":"图片-细体","rank":10001},
			{"sid":86,"name":"layui-icon-play","code":"&#xe652;","text":"播放","rank":10001},
			{"sid":87,"name":"layui-icon-praise","code":"&#xe6c6;","text":"赞","rank":10001},
			{"sid":88,"name":"layui-icon-prev","code":"&#xe65a;","text":"上一页","rank":10001},
			{"sid":89,"name":"layui-icon-prev-circle","code":"&#xe633;","text":"翻页","rank":10001},
			{"sid":90,"name":"layui-icon-radio","code":"&#xe643;","text":"单选框-选中","rank":10001},
			{"sid":91,"name":"layui-icon-rate","code":"&#xe67b;","text":"星星-空心","rank":10001},
			{"sid":92,"name":"layui-icon-rate-half","code":"&#xe6c9;","text":"半星","rank":10001},
			{"sid":93,"name":"layui-icon-rate-solid","code":"&#xe67a;","text":"星星-实心","rank":10001},
			{"sid":94,"name":"layui-icon-read","code":"&#xe705;","text":"办公-阅读","rank":10001},
			{"sid":95,"name":"layui-icon-refresh","code":"&#xe669;","text":"刷新","rank":10001},
			{"sid":96,"name":"layui-icon-refresh-1","code":"&#xe666;","text":"刷新","rank":10001},
			{"sid":97,"name":"layui-icon-refresh-3","code":"&#xe9aa;","text":"刷新-粗","rank":10001},
			{"sid":98,"name":"layui-icon-release","code":"&#xe609;","text":"发布 纸飞机","rank":10001},
			{"sid":99,"name":"layui-icon-reply-fill","code":"&#xe611;","text":"回复 评论 实心","rank":10001},
			{"sid":100,"name":"layui-icon-return","code":"&#xe65c;","text":"返回","rank":10001},
			{"sid":101,"name":"layui-icon-right","code":"&#xe602;","text":"箭头 向右","rank":10001},
			{"sid":102,"name":"layui-icon-rmb","code":"&#xe65e;","text":"金额-人民币","rank":10001},
			{"sid":103,"name":"layui-icon-search","code":"&#xe615;","text":"搜索","rank":10001},
			{"sid":104,"name":"layui-icon-senior","code":"&#xe674;","text":"高级","rank":10001},
			{"sid":105,"name":"layui-icon-set","code":"&#xe716;","text":"设置-空心","rank":10001},
			{"sid":106,"name":"layui-icon-set-fill","code":"&#xe614;","text":"设置-实心","rank":10001},
			{"sid":107,"name":"layui-icon-set-sm","code":"&#xe620;","text":"设置-小型","rank":10001},
			{"sid":108,"name":"layui-icon-share","code":"&#xe641;","text":"分享","rank":10001},
			{"sid":109,"name":"layui-icon-shrink-right","code":"&#xe668;","text":"右向左伸缩菜单","rank":10001},
			{"sid":110,"name":"layui-icon-snowflake","code":"&#xe6b1;","text":"雪花","rank":10001},
			{"sid":111,"name":"layui-icon-speaker","code":"&#xe645;","text":"消息-通知-喇叭","rank":10001},
			{"sid":112,"name":"layui-icon-spread-left","code":"&#xe66b;","text":"左向右伸缩菜单","rank":10001},
			{"sid":113,"name":"layui-icon-star","code":"&#xe600;","text":"收藏-空心","rank":10001},
			{"sid":114,"name":"layui-icon-star-fill","code":"&#xe658;","text":"收藏-实心","rank":10001},
			{"sid":115,"name":"layui-icon-survey","code":"&#xe6b2;","text":"调查","rank":10001},
			{"sid":116,"name":"layui-icon-table","code":"&#xe62d;","text":"表格","rank":10001},
			{"sid":117,"name":"layui-icon-tabs","code":"&#xe62a;","text":"Tabs 选项卡","rank":10001},
			{"sid":118,"name":"layui-icon-template","code":"&#xe663;","text":"模板","rank":10001},
			{"sid":119,"name":"layui-icon-template-1","code":"&#xe656;","text":"模板","rank":10001},
			{"sid":120,"name":"layui-icon-templeate-1","code":"&#xe630;","text":"选择模板","rank":10001},
			{"sid":121,"name":"layui-icon-theme","code":"&#xe66a;","text":"主题","rank":10001},
			{"sid":122,"name":"layui-icon-tips","code":"&#xe702;","text":"提示说明","rank":10001},
			{"sid":123,"name":"layui-icon-top","code":"&#xe604;","text":"top 置顶","rank":10001},
			{"sid":124,"name":"layui-icon-tread","code":"&#xe6c5;","text":"踩","rank":10001},
			{"sid":125,"name":"layui-icon-tree","code":"&#xe62e;","text":"树","rank":10001},
			{"sid":126,"name":"layui-icon-triangle-d","code":"&#xe625;","text":"下三角","rank":10001},
			{"sid":127,"name":"layui-icon-triangle-r","code":"&#xe623;","text":"右三角","rank":10001},
			{"sid":128,"name":"layui-icon-unlink","code":"&#xe64d;","text":"删除链接","rank":10001},
			{"sid":129,"name":"layui-icon-up","code":"&#xe619;","text":"箭头 向上","rank":10001},
			{"sid":130,"name":"layui-icon-upload","code":"&#xe67c;","text":"上传-实心","rank":10001},
			{"sid":131,"name":"layui-icon-upload-circle","code":"&#xe62f;","text":"上传-圆圈","rank":10001},
			{"sid":132,"name":"layui-icon-upload-drag","code":"&#xe681;","text":"上传-空心-拖拽","rank":10001},
			{"sid":133,"name":"layui-icon-user","code":"&#xe770;","text":"用户","rank":10001},
			{"sid":134,"name":"layui-icon-username","code":"&#xe66f;","text":"用户名","rank":10001},
			{"sid":135,"name":"layui-icon-util","code":"&#xe631;","text":"工具","rank":10001},
			{"sid":136,"name":"layui-icon-vercode","code":"&#xe679;","text":"验证码","rank":10001},
			{"sid":137,"name":"layui-icon-video","code":"&#xe6ed;","text":"视频","rank":10001},
			{"sid":138,"name":"layui-icon-voice","code":"&#xe688;","text":"语音-声音","rank":10001},
			{"sid":139,"name":"layui-icon-water","code":"&#xe636;","text":"水 下雨","rank":10001},
			{"sid":140,"name":"layui-icon-website","code":"&#xe7ae;","text":"网站","rank":10001}
			]
			},
	
	onRender: function() {
		var me=this,search=Ext.get("search");
		var valuechange=function(e,t){
			var list=Ext.query('#layui_icon_list li'),v=t.value;
			Ext.iterate(list,function(e,i){
				var n1=e.children[1],name=n1.innerText||n1.textContent,
				n2=e.children[2],text=n2.innerText||n2.textContent,
				show=(name&&name.indexOf(v)>-1)||(text&&text.indexOf(v)>-1);
				e.style.display=show?"inline-block":"none";
			});
		};
		search.on('input',valuechange);
		search.on('propertychange',valuechange);
		 Ext.get("layui_icon_list").on('click', function(e,t){  
           var i=  t.children[0],v= i.getAttribute("class");
           me.valueHolder.setValue(v);
           me.hide();
         },this, {
        	 delegate: 'li'
        	 });
		this.callParent();
	}
});
